<?xml version="1.0" encoding="UTF-8" ?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

	<p:dialog id="popUpNuevoUsuario"
		header="#{i18n['mpo.usuario.registrar']}"
		style="height:50% !important; height:50% !important; top:25% !important; left: 30% !important;"
		widgetVar="dlgNuevoUsuario" modal="true" minWidth="600" width="600"
		appendTo="@(body)" dynamic="true" height="300" minHeight="300">
		<h:form id="formNuevoUsuario" styleClass="formulario">
			<p:panel id="pnlNuevoUsuario">
				<table class="formulario">
					<tr>
						<td width="30%"><h:outputLabel for="txtNombre"
								value="#{i18n['mpo.usuario.nombre']}" /> <h:outputLabel
								value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" /></td>
						<td width="70%"><p:inputText id="txtNombre"
								style="width: 100%" required="true"
								value="#{usuarioDataManager.personaInstancia.nombres}"
								label="#{i18n['mpo.usuario.nombre']}" /></td>
					</tr>
					<tr>
						<td><h:outputLabel for="txtApellido"
								value="#{i18n['mpo.usuario.apellido']}" /> <h:outputLabel
								value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" /></td>
						<td><p:inputText id="txtApellido" style="width: 100%"
								required="true"
								value="#{usuarioDataManager.personaInstancia.apellidos}"
								label="#{i18n['mpo.usuario.apellido']}" /></td>
					</tr>
					<tr>
						<td><h:outputLabel for="txtCI"
								value="#{i18n['mpo.usuario.ci']}" /></td>
						<td><p:inputText id="txtCI" style="width: 100%"
								onkeypress="return soloEnteros(this, event)" maxlength="10"
								value="#{usuarioDataManager.personaInstancia.ci}"
								label="#{i18n['mpo.usuario.ci']}">
								<f:validateLength maximum="10" />
								<f:validator validatorId="com.mpo.web.validador.CedulaValidator" />
							</p:inputText></td>
					</tr>
					<tr>
						<td><h:outputLabel for="txtMail"
								value="#{i18n['mpo.usuario.email']}" />
								<h:outputLabel
								value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" /></td>
						<td><p:inputText id="txtMail" style="width: 100%"
								value="#{usuarioDataManager.personaInstancia.email}"
								label="#{i18n['mpo.usuario.email']}">
								<f:validator validatorId="com.mpo.web.validador.EmailValidator" />
							</p:inputText></td>
					</tr>
					<tr>
						<td><h:outputLabel for="selectEmpresa"
								value="#{i18n['label.empresa']}" /> <h:outputLabel
								value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" /></td>
						<td><h:selectOneMenu id="selectEmpresa" required="true"
								style="width: 100%"
								value="#{usuarioController.idEmpresaSeleccionada}"
								label="#{i18n['label.empresa']}">
								<f:selectItem itemValue=""
									itemLabel="#{i18n['label.seleccione']}" />
								<f:selectItems
									value="#{selectItemsController.catalogoListaEmpresa}" />
								<p:ajax event="change" process="@this" update="selectPerfil"
									listener="#{usuarioController.obtenerPerfilesEmpresa}" />
							</h:selectOneMenu></td>
					</tr>
					<tr>
						<td><h:outputLabel for="selectPerfil"
								value="#{i18n['label.perfil']}" /> <h:outputLabel
								value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" /></td>
						<td><p:selectOneMenu id="selectPerfil" required="true"
								style="width: 100%"
								value="#{usuarioController.idPerfilSeleccionado}"
								label="#{i18n['label.perfil']}">
								<f:selectItem itemValue=""
									itemLabel="#{i18n['label.seleccione']}" />
								<f:selectItems value="#{usuarioController.catalogoPerfiles}" />
								<p:ajax event="change" process="@this" update="selectModulos"
									listener="#{usuarioController.obtenerModuloMenu(usuarioController.idPerfilSeleccionado)}" />
							</p:selectOneMenu></td>
					</tr>
					<tr>
						<td><h:outputLabel for="selectModulos"
								value="#{i18n['label.menu.usuario']}" /> <h:outputLabel
								value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" /></td>
						<td><p:tree id="selectModulos"
								selection="#{usuarioController.selectedNodes}"
								value="#{usuarioController.treeNodeModulos}" var="modulo"
								selectionMode="checkbox">
								<p:treeNode Oicon="ui-icon-note">
									<h:outputText value="#{modulo.npNombreOpcion}" />
								</p:treeNode>
							</p:tree></td>
					</tr>
				</table>
			</p:panel>
			<p:panel id="pnlBotones">
				<p:commandButton id="btnGuardar" value="#{i18n['label.guardar']}"
					actionListener="#{usuarioController.registrarUsuario}"
					oncomplete="if (args &amp;&amp; !args.validationFailed) dlgNuevoUsuario.hide()"
					process="@this,pnlNuevoUsuario"
					update="pnlNuevoUsuario,:formUsuario:tablaUsuarios,:formUsuario:pnlMessages" />
				<p:commandButton value="#{i18n['label.cancelar']}"
					onclick="dlgNuevoUsuario.hide();" type="button" />
			</p:panel>
		</h:form>
	</p:dialog>

</ui:composition>